@import "../../assets/scss/core/base";

$table-prefix-cls: #{$jigsaw-prefix}-table;

.#{$table-prefix-cls}-header-cell{
    position: relative;
}

.#{$table-prefix-cls}-sort-box{
    @include inline-block;
    position: absolute;
    right: 0;
    top: 0;
    font-size: 0;
    width: 14px;
    height: 100%;
}

.#{$table-prefix-cls}-sort-btn{
    position: relative;
    display: block;
    width: 100%;
    height: 48%;
    cursor: pointer;
    &:after{
        position: absolute;
        left: 50%;
        margin-left: -4px;
        width: 0;
        height: 0;
        border-width: 6px 4px;
        border-style:solid;
        content: '';
    }
}
.#{$table-prefix-cls}-sort-up{
    margin-bottom: 14%;
    &:after{
        bottom: 0;
        border-color: transparent transparent $text-color transparent;
    }
    &:hover:after{
        border-bottom-color: $text-color-dark;
    }
}
.#{$table-prefix-cls}-sort-down{
    &:after{
        top: 0;
        border-color: $text-color transparent transparent transparent;
    }
    &:hover:after{
        border-top-color: $text-color-dark;
    }
}

.#{$table-prefix-cls}-asc{
    .#{$table-prefix-cls}-sort-up:after{
        border-bottom-color: $primary-color;
    }
}

.#{$table-prefix-cls}-des{
    .#{$table-prefix-cls}-sort-down:after{
        border-top-color: $primary-color;
    }
}
